<ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:p="http://primefaces.org/ui" xmlns:h="http://java.sun.com/jsf/html"
	template="/templates/template-cadastro.xhtml">

	<ui:define name="title">
		<p:outputLabel value="#{label['caixa.titulo']}" styleClass="header-page" />
	</ui:define>

	<ui:define name="campos">

		<p:panel>

			<p:panelGrid>

				<p:row>
					<p:column style="width:23% !important">
						<p:spacer />
					</p:column>
					<p:column style="width:23% !important">
						<p:spacer />
					</p:column>
					<p:column style="width:8% !important" rowspan="6">
						<p:spacer />
					</p:column>
					<p:column style="width:23% !important">
						<p:spacer />
					</p:column>
					<p:column style="width:23% !important">
						<p:spacer />
					</p:column>
				</p:row>

				<p:row rendered="#{caixaAtendenteMB.boolFechamento}">
					<p:column>
						<p:outputLabel value="#{label['caixa.campo.data_abertura']}" for="caixa_data_abertura" />
					</p:column>
					<p:column>
						<p:calendar id="caixa_data_abertura" value="#{caixaAtendenteMB.modelCad.dataAbertura}" disabled="true"
							pattern="dd/MM/yyyy HH:mm" />
					</p:column>
					<p:column>
						<p:outputLabel value="#{label['caixa.campo.data_fechamento']}" for="caixa_data_fechamento" />
					</p:column>
					<p:column>
						<p:calendar id="caixa_data_fechamento" value="#{caixaAtendenteMB.modelCad.dataFechamento}" disabled="true"
							pattern="dd/MM/yyyy HH:mm" />
					</p:column>
				</p:row>

				<p:row rendered="#{caixaAtendenteMB.boolFechamento}">
					<p:column colspan="2">
						<p:spacer height="1" width="100%" style="background:#cccccc" />
					</p:column>
					<p:column colspan="2">
						<p:spacer height="1" width="100%" style="background:#cccccc" />
					</p:column>
				</p:row>

				<p:row>
					<p:column>
						<p:outputLabel value="#{label['caixa.campo.caixa_inicial']}" for="caixa_valor_inicial" />
					</p:column>
					<p:column>
						<p:inputText id="caixa_valor_inicial" value="#{caixaAtendenteMB.modelCad.vlrCaixaInicial}"
							required="#{!caixaAtendenteMB.boolFechamento}" disabled="#{caixaAtendenteMB.boolFechamento}" />
					</p:column>
					<p:column>
						<p:outputLabel value="#{label['caixa.campo.valor_deposito']}" for="caixa_valor_deposito"
							rendered="#{caixaAtendenteMB.boolFechamento}" />
					</p:column>
					<p:column>
						<p:inputText id="caixa_valor_deposito" value="#{caixaAtendenteMB.modelCad.vlrDepositado}"
							rendered="#{caixaAtendenteMB.boolFechamento}" required="#{caixaAtendenteMB.boolFechamento}">
							<p:ajax event="change" process="@this" update="caixa_total" />
						</p:inputText>
					</p:column>
				</p:row>
				<p:row>
					<p:column>
						<p:outputLabel value="#{label['caixa.campo.valor_venda_atual']}" for="caixa_venda_atual"
							rendered="#{caixaAtendenteMB.boolFechamento}" />
					</p:column>
					<p:column>
						<p:inputText id="caixa_venda_atual" value="#{caixaAtendenteMB.modelCad.vlrVendaAtual}" disabled="true"
							rendered="#{caixaAtendenteMB.boolFechamento}" />
					</p:column>
					<p:column>
						<p:outputLabel value="#{label['caixa.campo.retirada_avulsa']}" for="caixa_retirada_avulsa"
							rendered="#{caixaAtendenteMB.boolFechamento}" />
					</p:column>
					<p:column>
						<p:inputText id="caixa_retirada_avulsa" value="#{caixaAtendenteMB.modelCad.vlrRetiradaAvulsa}"
							rendered="#{caixaAtendenteMB.boolFechamento}" required="#{caixaAtendenteMB.boolFechamento}">
							<p:ajax event="change" process="@this" update="caixa_total" />
						</p:inputText>
					</p:column>
				</p:row>
				<p:row>
					<p:column>
						<p:outputLabel value="#{label['caixa.campo.saldo_em_caixa']}" for="caixa_saldo"
							rendered="#{caixaAtendenteMB.boolFechamento}" />
					</p:column>
					<p:column>
						<p:inputText id="caixa_saldo" value="#{caixaAtendenteMB.modelCad.vlSaldoEmCaixa}" disabled="true"
							rendered="#{caixaAtendenteMB.boolFechamento}" />
					</p:column>
					<p:column>
						<p:outputLabel value="#{label['caixa.campo.total']}" for="caixa_total" disabled="true"
							rendered="#{caixaAtendenteMB.boolFechamento}" />
					</p:column>
					<p:column>
						<p:inputText id="caixa_total" value="#{caixaAtendenteMB.modelCad.vlrTotal}" disabled="true"
							rendered="#{caixaAtendenteMB.boolFechamento}" />
					</p:column>
				</p:row>
			</p:panelGrid>
		</p:panel>

		<p:spacer width="100%" height="20" rendered="#{caixaAtendenteMB.boolFechamento}" />

		<p:panel rendered="#{caixaAtendenteMB.boolFechamento}">
			<p:panelGrid>
				<p:row>
					<p:column>
						<p:outputLabel value="#{label['caixa.campo.anotacoes']}" />
					</p:column>
				</p:row>
				<p:row>
					<p:column>
						<p:inputTextarea id="caixa_anotacoes" value="#{caixaAtendenteMB.modelCad.motivoRetirada}" rows="6"
							style="width:100% !important" />
					</p:column>
				</p:row>
			</p:panelGrid>
		</p:panel>

	</ui:define>

	<ui:define name="comandos">
		<p:commandButton value="#{label['sistema.botao.abrir']}" rendered="#{!caixaAtendenteMB.boolFechamento}" update="@form"
			actionListener="#{caixaAtendenteMB.executarAbrirCaixa()}" >
			<p:confirm message="Deseja realmente abrir o caixa?" />
		</p:commandButton>
		<p:commandButton value="#{label['sistema.botao.fechar']}" rendered="#{caixaAtendenteMB.boolFechamento}" update="@form"
			actionListener="#{caixaAtendenteMB.executarFecharCaixa()}" >
			<p:confirm message="Deseja realmente fechar o caixa?" />
		</p:commandButton>
	</ui:define>

</ui:composition>